import * as React from 'react';
import {Component} from 'react'; 
import { mergeStyles } from '@fluentui/react/lib/Styling';
import { FontIcon } from '@fluentui/react/lib/Icon';  
import './TriggerTimeline.css';

const iconClass = mergeStyles({
    color:'#DCDCDC',
    fontSize: 12,
    height: 20,
    lineHeight:20,
    borderRadius:2,
    cursor:'pointer',
    width: 20,
  });
  
const iconClass2 = mergeStyles({
    color:'#13b479',
    fontSize: 20,
    height: 20,
    lineHeight:20, 
    cursor:'pointer',
    width: 20,
  });
 
class TriggerTimeline extends Component { 
  constructor(props){
    super(props); 
    this.state={
        thisIndex:parseInt(props.thisIndex),
        maxIndex:props.maxIndex,
        timeNode:props.timeNode, //lastRunTime,nextRunTime,numberOfRuns,status
    }
  }


  render(){
    return (
      <>
      <div className='timeline_row'>
        <div className='time'> 
            {
                this.state.thisIndex===0? <div className='nextruntime active'>{this.state.timeNode.nextRunTime}</div>:
                <div className='nextruntime'>{this.state.timeNode.nextRunTime}</div>
            }
            <div className='spccode'>{"<-"}</div>
            <div className='lastruntime'>{this.state.timeNode.lastRunTime}</div>
        </div>
        <div className='content'>
            <div className='vCode'>
            {
                this.state.thisIndex===0? <FontIcon iconName="BufferTimeAfter" className={iconClass2}/>:<FontIcon iconName="LocationFill" className={iconClass}/>
            }
            </div>
            {
                this.state.thisIndex!==this.state.maxIndex?(<div className='vline'></div>):null
            }
            <div className='rowtxt num'>
                第 <span>{this.state.timeNode.numberOfRuns}</span>次运行
            </div>
            <div className='rowtxt con'>
                Sundial.CronTrigger:<span>{this.state.timeNode.args}</span>
            </div>
        </div>
      </div>
      </>
    );
  }
  componentDidMount(){ 
  }
};
 
export default TriggerTimeline